<style>
	label{
		display: block;
		font-weight: bold;
	}
	input.text { 
		margin-bottom:12px; 
		width:85%; 
		padding: .4em; 
	}
</style>
<script>

$(document).ready(function() {
	$("#status_sprint").selectmenu({ width:195 });
	$("#form_upsert_sprint").validationEngine();
	$( "#dateIni" ).datepicker({dateFormat: 'yy-mm-dd',
			onSelect: function(dateText){
				$("#form_upsert_sprint").validationEngine('validateField', "#dateEnd"); }});
	$( "#dateEnd" ).datepicker({dateFormat: 'yy-mm-dd',
		onSelect: function(dateText){
			$("#form_upsert_sprint").validationEngine('validateField', "#dateIni"); }});

	
});
</script>
<div id="dialog-sprint" title="Create or edir a sprint">
	<form id="form_upsert_sprint" class="modal" METHOD="POST" action="<?= base_url() ?>index.php/sprint/save">
	 <div class="container_12">	
		<div class="grid_6">
			<label for="dateIni">Start Date</label>
			<input type="text" name="dateIni" id="dateIni"  value="" class="text ui-widget-content ui-corner-all validate[required] validate[custom[date]] validate[dateRange[grp1]] text-input datepicker " />
		</div>
		<div class="grid_6">
			<label for="dateEnd">End Date</label>
			<input type="text" name="dateEnd" id="dateEnd" value=""  class="text ui-widget-content ui-corner-all validate[required] validate[custom[date]] validate[dateRange[grp1]] text-input datepicker"/>
		</div>
		<div class="clear"></div>
		<div class="grid_6">
			<label for="status_sprint">Status</label>
			<select name="status_sprint" id="status_sprint" class="text ui-widget-content ui-corner-all">
  				<option class="text ui-widget-content ui-corner-all" value="Open">Open</option>
  				<option class="text ui-widget-content ui-corner-all" value="In Progress">In Progress</option>
  				<option class="text ui-widget-content ui-corner-all" value="Resolved">Resolved</option>
			</select>
		</div>
		<input type="hidden" value="" name="id" id="id" />
	 </div>
	</form>
</div>
